﻿
(function ($) {
    //初始化


    var initialsaveandload = function ($target, settings) {
        $container = $("#container")
        if (settings.issaveorload == "save") {
            var stylelist = new Array();
            var leftlist = new Array();
            var toplist = new Array();
            var i = 0;
            $container.find(".pageEditorElementItem").each(function () {
                var $this = $(this);
                stylelist[i] = "pageEditorElementItem";
                leftlist[i] = $this[0].offsetLeft;
                toplist[i] = $this[0].offsetTop;
                i += 1;

            });
            $container.find(".pageEditorElementMilestone").each(function () {
                var $this = $(this);
                var sty = $this[0].children[0].children[0].className
                stylelist[i] = sty;
                leftlist[i] = $this[0].offsetLeft;
                toplist[i] = $this[0].offsetTop;
                i += 1;

            });
            var slist = "";
            var llist = ""
            var tlist = ""
            for (var v = 0; v < i; v++) {
                slist += stylelist[v] + " ";
                llist += leftlist[v] + " ";
                tlist += toplist[v] + " ";
            }

            $.post(
                "draw/Element",
                {
                    state: "write",
                    style: slist,
                    left: llist,
                    top: tlist
                });

            var sl = "";
            var st = ""
            var el = ""
            var et = ""

            var alllines = $("#container").attrFunctions('l', "all");


            for (var i = 0; i < alllines.length; i++) {
                var aline = alllines[i];
                var start = aline.getStart();
                var end = aline.getEnd();
                sl += start[0].offsetLeft + " ";

                st += start[0].offsetTop + " ";

                el += end[0].offsetLeft + " ";

                et += end[0].offsetTop + " ";


            }
            $.post(
                "draw/line",
                {
                    states: "write",
                    sl: sl,
                    st: st,
                    el: el,
                    et: et
                });


        }
        if (settings.issaveorload == "load") {
            $container.find(".pageEditorElementItem ,.pageEditorElementMilestone").each(function () {
                var $this = $(this);
                $this.remove();

            })
            $container.restartFunctions();
            $container.find(".line, .node, .arrow").each(function () {
                var EditorElement = $(this);
                EditorElement.remove();
            })
            drawElement();
            //            
            $("#container").setoffwrite();

        }
    };

    var drawElement = function () {
        $.post("/draw/Element", { state: "read" }, function (results) {
            var result = eval("(" + results + ")");


            var $addedDiv = ""
            for (var t = 0; t < result.tble.length; t++) {


                if (result.tble[t].style == "pageEditorElementItem") {
                    c = { wrapper: 'pageEditorElementItem', container: 'pageEditorElementItemBox' }
                    $addedDiv = $('<div class="' + c.wrapper + '"><div class="' + c.container + '"></div></div>').appendTo($container);
                }
                else if (result.tble[t].style == "start") {
                    c = { wrapper: 'pageEditorElementMilestone', container: 'pageEditorElementMilestoneBox' }
                    $addedDiv = $('<div class="' + c.wrapper + '"><div class="' + c.container + '"><div class="start"/></div></div>').appendTo($container);
                }
                else if (result.tble[t].style == "end") {
                    c = { wrapper: 'pageEditorElementMilestone', container: 'pageEditorElementMilestoneBox' }
                    $addedDiv = $('<div class="' + c.wrapper + '"><div class="' + c.container + '"><div class="end"/></div></div>').appendTo($container);
                }
                //$addedDiv.addbox();
                $addedDiv.data('containerclass', c);
                $addedDiv.css('position', 'absolute')
                .css('left', eval(result.tble[t].left))
               .css('top', eval(result.tble[t].top))

                $addedDiv.addInterfaces();
                $addedDiv.clickFunction({ isnodeclick: 0, isarrowclick: 0 });


            };
            $container.find(".pageEditorElementItem ,.pageEditorElementMilestone").each(function () {
                var $this = $(this);
                $this.draggable({ drag: function () {
                    $this.setdragFunction();
                }
                })
                $this.mouseup(function () {
                    $this.setdragFunction();

                });
                $this.mouseover(function () {
                    $this.css("cursor", "pointer")
                })
                $this.mouseout(function () {
                    $this.css("cursor", "default")
                })
            })
            drawline();
        })
    }
    var drawline = function () {
        $.post("/draw/line", { states: "read" }, function (results) {
            var result = eval("(" + results + ")");

            //alert("success");
            for (var t = 0; t < result.tble.length; t++) {
                var s1, s2, a1, a2, s3, s4, $start, $end;
                s1 = result.tble[t].sl
                s2 = result.tble[t].st
                s3 = result.tble[t].el
                s4 = result.tble[t].et;
                $container.find(".pageEditorElementItem ,.pageEditorElementMilestone").each(function () {
                    var $this = $(this);
                    a1 = $this[0].offsetLeft
                    a2 = $this[0].offsetTop

                    if (a1 == s1 && a2 == s2) {
                        $start = $this;
                    }
                    if (a1 == s3 && a2 == s4) {
                        $end = $this;
                    }

                })
                var currentline = null;
                if ($start && $end) {
                    currentline = line($start, $end)
                    currentline.end($end);

                    addlinstate();
                    $container.attrFunctions('l', currentline);
                    currentline = null;
                }
            }
        })

    }

    jQuery.fn.saveandloadFunction = function (options) {
        var settings = jQuery.extend({
            issaveorload: null
        }, options);
        clearclassFunction();
        initialsaveandload($(this), settings);
        return this;
    };
})(jQuery);
